import {
	Button,
	Calendar as AriaCalendar,
	CalendarCell,
	CalendarGrid,
	CalendarProps as AriaCalendarProps,
	DateValue,
	Heading,
	Text,
} from 'react-aria-components';

import './Calendar.css';

export interface CalendarProps<T extends DateValue>
	extends AriaCalendarProps<T> {
	errorMessage?: string;
}

export function Calendar<T extends DateValue>({
	errorMessage,
	...props
}: CalendarProps<T>) {
	return (
		<AriaCalendar {...props}>
			<header>
				<Button slot="previous">◀</Button>
				<Heading />
				<Button slot="next">▶</Button>
			</header>
			<CalendarGrid>{(date) => <CalendarCell date={date} />}</CalendarGrid>
			{errorMessage && <Text slot="errorMessage">{errorMessage}</Text>}
		</AriaCalendar>
	);
}
